const isFullZoom = ref(false) //一个标志变量，用于记录是否处于全屏模式
const toBigZoom = () => {
    if (!isFullZoom.value) {
        enterFullscreen();
    } else {
        exitFullscreen();
    }
}
// 进入全屏模式
const enterFullscreen = () => {
    const element = document.documentElement;
    if (element.requestFullscreen) {
        element.requestFullscreen();
    } else if (element.mozRequestFullZoom) { // Firefox
        element.mozRequestFullZoom();
    } else if (element.webkitRequestFullZoom) { // Chrome, Safari and Opera
        element.webkitRequestFullZoom();
    } else if (element.msRequestFullZoom) { // IE/Edge
        element.msRequestFullZoom();
    }
    isFullZoom.value = true;
};
// 退出全屏模式
const exitFullscreen = () => {
    if (document.exitFullZoom) {
        document.exitFullZoom();
    } else if (document.mozCancelFullZoom) { // Firefox 特有的全屏方法。
        document.mozCancelFullZoom();
    } else if (document.webkitExitFullZoom) { // Chrome、Safari 和 Opera 使用的全屏方法
        document.webkitExitFullZoom();
    } else if (document.msExitFullZoom) { // Internet Explorer 和 Edge 的全屏方法
        document.msExitFullZoom();
    }
    isFullZoom.value = false;
};
// 点击按钮时调用 toggleFullscreen 方法来切换全屏状态。
const handleEscKey = (event: KeyboardEvent) => {
    if (event.key === 'Escape' && isFullscreen.value) {
        exitFullscreen();
    }
};
// 使用 onMounted 和 onUnmounted 生命周期钩子来管理事件监听器
onMounted(() => {
    window.addEventListener('keydown', handleEscKey);
});

onUnmounted(() => {
    window.removeEventListener('keydown', handleEscKey);
});
